import QtQuick 2.0

Rectangle{
    property string carName
    property string carID
    property string carState
    property string carDescribe
    property string carType
    border.width: 0
    radius: 40
    width: 500
    height: 530

    Image {
        id: bg
        source: "qrc:/imgs/card_bg.png"
//        width: 510
//        height: 570
//        anchors.right: parent.right
        anchors.fill: parent
    }

    Column{
        anchors.verticalCenter: parent.verticalCenter
        spacing: 70
        Column{
            spacing: 30
            anchors.left: parent.left
            anchors.leftMargin: 50
            Text {
                id: carNameText
                text: carName
                color: "#FFFFFF"
                anchors.right: parent.right
                font{
                    family: "Microsoft YaHei"
                    pixelSize: 50
                }
            }
            Row{
                spacing: 24
                anchors.left: parent.left
                Rectangle{
                    id: carStateRect
                    color: "#06FF96"
                    width: 24
                    height: 24
                    radius: 24
                    anchors.verticalCenter: parent.verticalCenter
                }

                Text {
                    id: carStateText
                    text: carState
                    color: "#06FF96"
                    font{
                        family: "Microsoft YaHei"
                        pixelSize: 32
                    }
                }
            }
        }

        Column{
            spacing: 30
            anchors.left: parent.left
            anchors.leftMargin: 50
            Text {
                id: carIDText
                text: "车辆编号:  " + carID
                width: 460
                anchors.left: parent.left
                color: Qt.rgba(255, 255, 255, 0.7)
                font{
                    family: "Microsoft YaHei"
                    pixelSize: 24
                }
                wrapMode: Text.WrapAnywhere
            }

            Text {
                id: carDescribeText
                width: 460
                anchors.left: parent.left
                text: "所属单位:  " + carDescribe
                color: Qt.rgba(255, 255, 255, 0.7)
                font{
                    family: "Microsoft YaHei"
                    pixelSize: 24
                }
                wrapMode: Text.WrapAnywhere
            }
        }

    }

    onCarStateChanged: {
        if(carState == "在线" || carState == "空闲"){
            carStateRect.color = "#06FF96"
            carStateText.color = "#06FF96"
        }else if(carState == "远程驾驶中"){
            carStateRect.color = "#FFC701"
            carStateText.color = "#FFC701"
        }
        else if(carState == "离线"){
            carStateRect.color = "#8D8D8D"
            carStateText.color = "#8D8D8D"
        }
    }

    function updateInfo(vechicleInfo){
        carName = vechicleInfo.name
        carID = vechicleInfo.name
        carState = vechicleInfo.state
        carDescribe = vechicleInfo.describe
        carType = vechicleInfo.type
    }
}
